   <%@page import="com.wanmait.hotelManage.vo.Pager"%>
<%@page import="com.wanmait.hotelManage.vo.RoomType"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%String path=request.getContextPath(); %>
    <script src="<%=request.getContextPath() %>/static/js/jquery-3.5.1.min.js"></script>
<jsp:include page="/inc/header.jsp"/>
     <!--Page Title-->
    <section class="page-title text-center">
        <div class="auto-container">
            <div class="content-box">
                <div class="title">房型列表</div>
                <ul class="bread-crumb">
                    <li><a href="<%=path%>/indexServlet">首页<i class="fa fa-angle-right"></i></a></li>
                    <li>房型列表</li>
                </ul>
            </div>
        </div>
    </section>
    <!--End Page Title-->

    <!-- service section -->
    <section class="rooms-list rooms-grid">
    	<div class="container">
    	<div id="qq">
 <%List<RoomType> roomTypes=(List<RoomType>)request.getAttribute("roomTypes");  %>
    	<%
    	for(RoomType roomType:roomTypes)
    	{
    	%>
    	
    		<div class="RoomTypes">
    	
    			<div class="single-item  wow fadeInLeft animated animated animated">
    				<div class="row">
    					<div class="col-md-4 col-sm-6 col-xs-12">
	    					<div class="img-box">
	    						<a href="<%=request.getContextPath() %>/roomListServlet?action=roomDetail&roomTypeName=<%=roomType.getTitle()%>">
	    						<img style="width: 400px;height: 300px;" src="<%=request.getContextPath() %>/static/images/rooms/<%=roomType.getPic() %>" alt=""></a>
	    					</div>
	    				</div>
	    				<div class="col-md-8 col-sm-8 col-xs-12">
	    					<div class="rooms-content">
	    						<a href="<%=request.getContextPath() %>/roomListServlet?action=roomDetail&roomTypeName=<%=roomType.getTitle()%>"><h3 class="roomtypename"><%=roomType.getTitle() %></h3></a>
	    						<div class="text"><span style="text-decoration: line-through"><%=roomType.getDiscountPrice() %></span>原价
	    						<span><%=roomType.getPrice() %> 现价</span> </div>
	    						<ul class="rating">
	    							<li><i class="fa fa-star" aria-hidden="true"></i></li>
	    							<li><i class="fa fa-star" aria-hidden="true"></i></li>
	    							<li><i class="fa fa-star" aria-hidden="true"></i></li>
	    							<li><i class="fa fa-star" aria-hidden="true"></i></li>
	    							<li><i class="fa fa-star" aria-hidden="true"></i></li>
	    						</ul>
	    						<p><%=roomType.getDescription() %></p>
	    						<a href="<%=request.getContextPath() %>/roomListServlet?action=roomDetail&roomTypeName=<%=roomType.getTitle()%>" class="btn-one">预定</a>
	    					</div>
	    				</div>
    				</div>
    			</div>
    			
    		</div>
    		
    		<%} %>
    	</div>
    	
    	<%Pager pager=(Pager)request.getAttribute("pager"); %>
    	<a class="numbers" href="javascript:void(0);"></a>

    		<ul class="rooms-btn text-center">
    			<!-- <li><a href="javascript:void(0);"><i class="fa fa-angle-left"></i></a></li>	 -->
<%

for(int i=1;i<=pager.getPageCount();i++)
{
%>
	
    			<li ><a class="number" href="javascript:void(0);"><%=i %></a></li>
    		
    <% 
}
%>
	<!-- <li><a href="javascript:void(0);"><i class="fa fa-angle-right"></i></a></li> -->
    		</ul>
    	</div>
    </section>
    <!-- service section end -->

    <!-- subscribe section -->
    <section class="subscribe-section">
    	<div class="container">
    		<div class="subscribe-title">
    			<div class="section-title">Subscribe to our Newsletter</div>
    		</div>
    		<div class="subscribe-form">
    			<input type="text" name="form_email" value="" placeholder="Your Email" required="">
    			<button type="submit">Subscribe</button>
    		</div>
    	</div>
    </section>

    <!-- subscribe section end -->
   
<jsp:include page="/inc/footer.jsp"/>

<script type="text/javascript">
	$(function(){
		
		$(".number").click(function(){
			
			$(".number").css("color","black");//所有数字变成黑色
			$(this).css("color","red");//点击的数字变成红色
			
			//获得点击的数字  $(this)是点击的a
			var n = $(this).html();
			//content是点击的a中间的内容  点击数字
	
			//从数据库中间查出新的一页的数据
			//Ajax
			$.ajax({
				url:"<%=request.getContextPath()%>/roomListServlet",
				type:"get",
				data:{action:"getroomtypes",pageNo:n},
				success:function(mes){
					
					$("#qq").html(mes);
				}
			});//ajax的结束
			
		});//click事件的结束
		
	});
</script>


